<template>
  <PageItemQueryCard ref="pqcsel" class="ServiceEnterpriseList-con" :eventPool="eventPool" :tableList="tableList" :QueryCardConfig="QueryConfig"
    :headerConfig="headerConfig">
    <!-- 0-无需开票 1-未开票 2-已开票 -->
    <template slot="isInvoicing" slot-scope="data">
      {{ { 0: '无需开票', 1: '未开票', 2: '已开票' }[data.text] }}
    </template>
    <template slot="businessType" slot-scope="data">
      <!-- {{ configData.ywlxObj[data.text] }} -->
      {{data.text}}
    </template>
    <template slot="entType" slot-scope="data">
      {{ configData.qyTypeObj[data.text] }}
    </template>
    <template slot="businessStatus" slot-scope="data">
      {{ configData.ddztObj[data.text] }}
    </template>
    <!-- qyTypeObj -->
    <div slot="action" class="avtion-con" slot-scope="data">
      <a href="javascript:;" @click="goTo('1', data)">详情</a>
      <!-- <a-divider type="vertical" />
      <a href="javascript:;" @click="goTo('2', data)">{{ configData.ddztAvtionLabel[data.record.businessStatus] }}</a> -->
    </div>
  </PageItemQueryCard>
</template>

<script>
import configData from './utils/configData'
import pageEvent from './utils/pageEvent'
import * as Utils from '@/utils/util'


const formItemAttr_ = { labelCol: { xxl: 5, xl: 12 }, wrapperCol: { xxl: 16, xl: 12 } }
// { labelCol: { span: 5 }, wrapperCol: { span: 16 } }
const formItemAttr1_ = { labelCol: { xxl: 2, xl: 2 }, wrapperCol: { xxl: 20, xl: 22 } }
// { labelCol: { span: 6 }, wrapperCol: { span: 18 } }
const formItemAttr2_ = { labelCol: { xxl: 6, xl: 8 }, wrapperCol: { xxl: 18, xl: 14 } }
// labelCol: { span: 10 }, wrapperCol: { span: 14 }
const formItemAttr3_ = { labelCol: { xxl: 10, xl: 9 }, wrapperCol: { xxl: 14, xl: 15 } }
const formItemAttr4_ = { labelCol: { xxl: 10, xl: 6 }, wrapperCol: { xxl: 14, xl: 18 } }
window['ServiceEnterpriseList_param'] = null
window['ServiceEnterpriseList_tabNum'] = 0
export default {
  name: 'ServiceEnterpriseList',
  data() {
    // const tempEvent = {onChange:(...args)=>{this.onChange(...args,this)},onSelect:this.onSelect.bind(this),onSelectAll:this.onSelectAll.bind(this)}
    return {
      configData: configData,
      headerConfig: {
        show: true,
        title: '企业服务',
        btnList: [
          // { label: '返 回', itemAttr: { type: 'primary', icon: 'left' } }
          { label: '返 回', itemAttr: { type: 'primary' } }
        ]
      },
      tableList: [
        // otherAttrs:{rowSelection:tempEvent}
        { tabName: '全部（0）', columns: configData.ServiceEnterpriseListColumns, dataSource: [], total: 0, current: 1, pageSize: 10, showRowSelection: false },
        { tabName: '待审核（0）', columns: configData.ServiceEnterpriseListColumns, dataSource: [], total: 0, current: 1, pageSize: 10, showRowSelection: false },
        { tabName: '待完善（0）', columns: configData.ServiceEnterpriseListColumns, dataSource: [], total: 0, current: 1, pageSize: 10, showRowSelection: false },
        { tabName: '待支付（0）', columns: configData.ServiceEnterpriseListColumns, dataSource: [], total: 0, current: 1, pageSize: 10, showRowSelection: false },
        { tabName: '处理中（0）', columns: configData.ServiceEnterpriseListColumns, dataSource: [], total: 0, current: 1, pageSize: 10, showRowSelection: false },
        { tabName: '处理完成（0）', columns: configData.ServiceEnterpriseListColumns, dataSource: [], total: 0, current: 1, pageSize: 10, showRowSelection: false },
      ],
      QueryConfig: {
        pageFormConfig: {
          defaultFormConfig: {
            columnCount: 3,
            layout: 'horizontal',
            labelAlign: 'right',
            labelCol: { span: 6 },
            wrapperCol: { span: 18 },
            rowAttr: {
              // type:'',
              // justify:'',
              // gutter:'',
              // align:'',
            },
            celAttr: {
              // flex:'',
              // offset:'',
              // order:'',
              // pull:'',
              // push:'',
              span: 8,
              // xxl:{},
            }
          },
          formConfig: {
            columnCount: 4,
            layout: 'horizontal',
            labelAlign: 'right',
            labelCol: { span: 6 },
            wrapperCol: { span: 18 },
            rowAttr: {
              // type:'',
              // justify:'',
              // gutter:'',
              // align:'',
            },
            celAttr: {
              // flex:'',
              // offset:'',
              // order:'',
              // pull:'',
              // push:'',
              span: 6,
              // xxl:{},
            }
          },
        },
        layoutConfig: {
          // 查询框的外部阴影  show-box-shadow
          boxShadow: false,
          // 是否显示默认条件下的下边框线  show-border-bottom
          defaultQueryBorderBottom: false,
        },
        formListConfig: {
          formList: [
            { isDefault: true, enName: 'entName', cnName: '企业名称', type: 'input', value: '', itemAttr: { placeholder: '请输入企业名称', allowClear: true }, formItemAttr: formItemAttr_ },
            { isDefault: true, enName: 'id', cnName: '订单号', type: 'input', value: '', itemAttr: { placeholder: '请输入订单号', allowClear: true }, formItemAttr: formItemAttr_ },
            {
              isDefault: true, enName: 'entType', cnName: '企业类型', type: 'select', value: '',
              itemAttr: { placeholder: '请选择企业类型', allowClear: true },
              formItemAttr: formItemAttr_,
              optionList: configData.qyType
            },
            // createTime  lastCreateTime
            { enName: 'businessType', cnName: '业务类型', type: 'checkboxGroup', value: [], monoRow: true, optionList: configData.ywlx, formItemAttr: formItemAttr1_ },
            // serviceEnd  lastServiceEnd
            // { enName: 'businessStatus', cnName: '订单状态', type: 'select', value: [], optionList: configData.ddzt, itemAttr: { placeholder: '请选择订单状态' }, formItemAttr: formItemAttr2_ },
            { enName: 'isInvoicing', cnName: '业务发票', type: 'select', value: [], optionList: configData.ywfp, itemAttr: { placeholder: '请选择业务发票' }, formItemAttr: formItemAttr2_ },
          ]
        }
      }
    }
  },
  mounted() {
    this.pageInit()
  },
  methods: {
    pageEvent(type, ...args) {
      return pageEvent(type, this, ...args)
    },
    eventPool(index, type, data) {
      // type 的值有 query  tabChange  tableChange  tableSelect  tableSelectAll  btnClick

      const typeList = {
        btnClick: this.goBack,
        query: (index, data) => {
          const tempData = {...data, pageNo:1 };
          this.pageEvent('query', index, tempData)
        },
        tabChange: (index, data) => { this.pageEvent('tabChange', index, data) },
        tableChange: (index, data) => { this.pageEvent('query', index, data) }
      }
      console.log(' 列表页面 eventPool==》', index, type, data);
      typeList[type] && typeList[type](index, data)
    },
    pageInit() {
      // this.pageEvent('getBusinessType')
      const tabNum = window['ServiceEnterpriseList_tabNum']||0
      this.setTabAndTableNum(tabNum)
      const tempParam = window['ServiceEnterpriseList_param'] ? window['ServiceEnterpriseList_param'] :{data:{} ,pageNo:1,pageSize:10}
      console.log('pageInit====>',tempParam);
      this.pageEvent('query', tabNum, tempParam)
      window['ServiceEnterpriseList_param'] = null
    },
    setTabAndTableNum(tabNum){
      this.$refs.pqcsel.setTabsActiveNum(tabNum)
    },
    goBack() {
      this.$router.go(-1)
    },
    async goTo(type, data) {
      if (type == '1') {
        console.log('详情==》', data);
        const {record, tabNum} = data
        window['ServiceEnterpriseList_tabNum'] = tabNum || 0
        const flowNo_ = record.flowNo

        let entId_ = record.entId //data.record.entId  209403 注册中  209218  已设立
        const pageParam = { name: '银行开户', entName: '', entId: '', TaskStatus: '', data: {} }
        pageParam.name = configData.ywlxObj1[data.record.businessType]
        pageParam.data = data.record
        pageParam.entName = data.record.entName
        pageParam.entId = entId_
        pageParam.TaskStatus = this.configData.ddztObj[data.record.businessStatus]
        console.log('@@@@@@@@@@@@@@@@@@@@@@@@@@@@@',pageParam);
        Utils.Storage.set('enterpriseDetails1-page-data', pageParam)
        const pageType = data.record.businessType

        const pageUrlList = {
          '1003': '/invoice/invoiceRecord', //发票管理-发票记录
          '1004': '/invoice/invoiceRecord',
          '1001': '/enterprise/enterpriseList/enterpriseDetails1', // 企业详情
          '1002': '/enterprise/enterpriseList/enterpriseDetails1',
          '1013': '/enterprise/enterpriseList/enterpriseDetails1',
          '0': '/enterprise/enterpriseList/ServicesInProgress' // 各业务详情

        } //['1003','1004'] // 要跳转到    发票管理-发票记录

        if (pageType == '1001' || pageType == '1002' || pageType == '1013') {
          const res = await this.pageEvent('getDataForEntState', entId_)
          if (Number(res) < 140) {
            pageUrlList[pageType] = '/enterprise/enterpriseList/enterpriseDetails'
            // 企业详情--注册中
          } else {
            // 企业详情--已设立
            pageUrlList[pageType] = '/enterprise/enterpriseList/enterpriseDetails1'

          }
          console.log('企业详情   @@@===>', pageType, '|', res, '|');
        }
        const queryDataList = {
          '1003': {bizId: flowNo_ },
          '1004': {bizId: flowNo_ },
          '1001': { bizId: entId_ }, // 209218   data.record.entId
          '1002': { bizId: entId_ },
          '1013': { bizId: entId_ },
          '0': { t: 'enterpriseDetails1-page-data' }
        }



        this.$router.push({
          path: pageUrlList[pageType] || pageUrlList['0'],
          query: queryDataList[pageType] || queryDataList['0']
        });

      }
      if (type == '2') {
        const ddStateList = {
          // 0: '',
          1: (data)=>{
            // 调用删除接口
          },
          // 2: '',
          3: (data)=>{
            // 跳转到支付页面  myAccount/paymentPage ？ po=''
            const key = "ServiceEnterpriseList"
            Utils.Storage.set(key,{orderNo:[data.record.id]})
            this.$router.push({
              path: '/myAccount/accountManage',
              query: {
                po:key
              }
            });
          },
          // 4: '',
          // 5: '',
          // 6: '',
          // 7: '',
          // 8: ''
        }
        const tempState = data.record.businessStatus
        ddStateList[tempState] && ddStateList[tempState](data)
        // configData.ddztAvtionLabel[data.record.businessStatus]
        console.log(type, data);
      }
    },
  }
}
</script>

<style lang="less">
.ServiceEnterpriseList-con{
  .avtion-con{
      display: flex;
      justify-content: flex-start;
      align-items: center;
      padding-left: 20px;
    }
}

</style>
